<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>地波平台-地图监控</title>
    <link rel="stylesheet" href="/assets/map/css/main1119.css"/>
    <link rel="stylesheet" href="/assets/map/css/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/assets/map/css/fontawesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/assets/map/css/marquee.css">

    <link rel="stylesheet" href="/assets/map/mapcss/initmap.css">
    <link rel="stylesheet" href="/assets/map/mapcss/searchbar.css">
    <link rel="stylesheet" href="/assets/map/mapcss/mngwindow.css">
    <link rel="stylesheet" href="/assets/map/mapcss/addoverlay.css">
    <link rel="stylesheet" href="/assets/map/mapcss/infowindow.css">
</head>
<body>


<div id="container">
    <!-- 头部：跑马灯  搜索框-->
    <div class="header">
        <div id="infoBar" class="infoBar">
            <div class="marquee-sibling"></div>
            <div class="marquee">
                <ul id="marquee-content-items" class="marquee-content-items">
                </ul>
            </div>
        </div>

        <div class="mysearch-bar">
            <div class="input-group mysearch-bar-group">
                <input type="text" id="keyword" class="form-control"
                       onkeydown="schAddrEnter()" placeholder="请输入设备名称或搜索地址">
                <span class="input-group-btn">
                    <button class="btn btn-default" type="button" onclick="schAddr()">搜索</button>
                </span>
            </div>
        </div>
    </div>

    <!-- 标签页 -->
    <div class="mymng-window">
        <div class="mymng-title">
            <button type="button" class="btn btn-primary" onclick="initMngWindow(this)"
                    togstate="0" data-toggle="collapse" data-target="#mymng-content">
                <span class='mymng-unit' id="mymng-unit"></span>
                <span class="caret mymng-caret"></span>
            </button>
        </div>
        <div id="mymng-content" class="collapse">
            <ul id="mymng-tab" class="nav nav-tabs nav-justified">
                <li class="active"><a href="#mymng-alldevice" data-toggle="tab">设备管理</a></li>
                <li><a href="#mymng-seldevice" data-toggle="tab">筛选设备</a></li>
                <li><a href="#mymng-history" data-toggle="tab">报警列表</a></li>
            </ul>
            <div id="mymng-tabcontent" class="tab-content">
                <!-- 设备管理 -->
                <div class="tab-pane fade in active" id="mymng-alldevice">
                    <div class="myalldevice-group">
                        <div class="input-group">
                            <input id="mymng-dev-keyword" type="text" class="form-control"
                                   onkeydown="mymngSchDevEnter()" placeholder="请输入设备Id或设备名称">
                            <span class="input-group-btn">
                                <button class="btn btn-default" type="button" onclick="mymngSchDev()">搜索</button>
                            </span>
                        </div>
                    </div>
                    <div id="myalldevice-ul" class="mytab-ul"></div>
                </div>

                <!-- 筛选设备 -->
                <div class="tab-pane fade" id="mymng-seldevice">
                    <ul id="myseldevice-ul" class="mytab-ul">
                        <li>
                            <div class="mysel-checkbox">
                                <label><input type="checkbox" id="detector" checked="checked"/>终端</label>
                                <label><input type="checkbox" id="repeater" checked="checked"/>中继</label>
                            </div>
                        </li>
                        <li>
                            <div class="input-group mysel-input-group">
                                <span class="input-group-addon">工作状态</span>
                                <select class="form-control" id="mysel-workstate">
                                    <option value="9">选择所有</option>
                                    <option value="0">正常</option>
                                    <option value="1">离线</option>
                                    <option value="2">报警</option>
                                </select>
                            </div>
                        </li>
                    </ul>
                    <button type="button" class="btn btn-primary mysel-button"
                            onclick="selectDevice()">确认选择</button>
                </div>

                <!-- 报警列表 -->
                <div class="tab-pane fade" id="mymng-history">
                    <ul id="myalarmhis-ul" class="mytab-ul"></ul>
                </div>
            </div>
        </div>
    </div>


    <div style="position: absolute;left: 55px;bottom: 45px;z-index: 1;cursor: pointer;background:#ffff00"
         onclick="alertAlarm()">
        <button>报警测试</button>
    </div>

    <div id="mapReset" class="mapLayer" title="返回中心点">
        <i class="glyphicon glyphicon-screenshot"></i>
    </div>

    <div id="tip">
        <div id="myweather-title"></div>
        <div id="myweather-live"></div>
        <div id="myweather-forecast"></div>
    </div>

    <audio id="bj_alarm" loop hidden='true'>
        <source src="/assets/map/media/bj_alarm.mp3" type="audio/mpeg"/>
        <embed src="/assets/map/media/bj_alarm.mp3"/>
        <span>您的浏览器不支持该音频格式。</span>
    </audio>

    <audio id="alarm-media" controls>
        <span>Your browser does not support this audio format.</span>
    </audio>
</div>



<script src="http://webapi.amap.com/maps?v=1.3&key=b47a8a32ba9322448a427cf1f02a59f1&plugin=AMap.Geocoder,AMap.MouseTool,AMap.MarkerClusterer"></script>
<!-- 您申请的key值,plugin=AMap.MouseTool使用右击菜单需要 -->
<script src="http://cache.amap.com/lbs/static/es5.min.js"></script>
<script src="http://webapi.amap.com/ui/1.0/main.js"></script>   <!-- UI组件库 1.0 -->
<script type="text/javascript" src="https://webapi.amap.com/demos/js/liteToolbar.js"></script>

<script type="text/javascript" src="/assets/map/js/jquery.min.js"></script>
<script type="text/javascript" src="/assets/map/css/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/assets/map/js/layer/layer.js"></script>
<script type="text/javascript" src="/assets/map/js/echarts.min.js"></script>

<!--mock.js 依赖jQuery和require.js-->
<script type="text/javascript" src="/assets/map/mapjs/require.js"></script>
<script type="text/javascript" src="/assets/map/mock/mockdata.js"></script>

<script type="text/javascript" src="/assets/map/mapjs/config.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/initmap.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/ajaxupdate.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/addoverlay.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/infowindow.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/alertalarm.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/searchbar.js"></script>
<script type="text/javascript" src="/assets/map/mapjs/mngwindow.js"></script>


<script src="/assets/map/js/marquee.js"></script>
<script type="text/javascript">
    $(function () {
        createMarquee({        //初始化跑马灯插件
            //配置参数，若为空，则使用默认的参数
            duration:10000,                  //控制移动的速度。
            padding:200,                     //跑马灯序列的右边距
            hover: true                    //是否需要暂停悬停
        });
    });
</script>
<script>
    $(function(){
        initmap();

        ajaxUpdate();
        //window.setInterval(ajaxUpdate, config_mock.ajaxInterval);
    });

</script>

</body>
</html>